<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>登录</title>
  <link rel="stylesheet" href="../../libs/layui-v2.5.5/layui/css/layui.css">
  <link rel="stylesheet" href="../../css/public.css">
  <style>
    .layui-input-block,.layui-input-inline{
      margin-left: 0 !important;
      left: 0 !important;
    }
    .layui-btn{
      width: 100%;
    }
    form{
        height: 400px;
    }
  </style>
</head>
<body>
    <div class="box1 layui-container p0 bgD7 mAuto">
        <div class="bgSystem w100 h165"></div>
    </div>
    <div class="layui-row">
        <form class="layui-form bordereee boxShadoweee bgfff radius10 layui-col-xs10 layui-col-xs-offset1 mt-15 p15" action="">
            <p class="font24 bold">登 录</p>
            <div class="layui-form-item mt25">
              <div class="layui-input-block">
                <input type="text" name="mobile" required  lay-verify="userPhone" placeholder="请输入手机号码" autocomplete="off" class="layui-input">
              </div>
            </div>
            <div class="layui-form-item">
              <div class="layui-input-inline">
                <input type="password" name="password" lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input">
              </div>
            </div>
            <a class="alignR color666 h40 block layui-col-xs7 colorSystem" href="./findPassword.html">
              忘记密码？
            </a>
            <a class="alignR color666 h40 block layui-col-xs5" href="./register.html">
              没有账号，<span class="colorSystem">去注册</span>  
            </a>
            <div class="layui-form-item opacity0">
                <div class="layui-input-inline">
                  <input  class="layui-input">
                </div>
              </div>
              <div class="layui-form-item opacity0">
                  <div class="layui-input-inline">
                      <input  class="layui-input">
                  </div>
              </div>
            <div class="layui-form-item">
              <div class="layui-input-block">
                <button class="layui-btn bgSystem" lay-submit lay-filter="formDemo">登 录</button>
              </div>
            </div>
          </form>
    </div>
<script src="../../libs/jquery-v1.11.3.min.js"></script>
<script src="../../libs/layui-v2.5.5/layui/layui.js"></script>
<script src="../../libs/publicCookie.js"></script>
<script src="../../libs/public.js"></script>
<script>    
   layui.use(['layer', 'form','jquery'], function(){
        var layer = layui.layer,
            form = layui.form,
            $ = layui.$;
            
        //表单验证
        form.verify({
          userPhone: function(value, item){ 
            if(!(/^1[3456789]\d{9}$/.test(value))){ 
              return '请输入正确的手机号码';
            } 
          }
          ,pass: [
            /^[\S]{6,12}$/
            ,'密码必须6到12位，且不能出现空格'
          ] 
        }); 
        
        //监听提交
        form.on('submit(formDemo)', function(data){
          $.ajax({
                type: 'post',
                url:link+'/mobile/doLogin',
                data:data.field,
                dataType: 'json',
                success: function (res) {
                    if(res.success){
                      //保存cookie
                      SetCookieDomain('token',res.entity.token,'');
                      SetCookieDomain('nickname',res.entity.nickname,'');
                      SetCookieDomain('mobile',res.entity.mobile,'');
                      $.ajax({
                        type: 'post',
                        url:link+'/mobile/verifyMessage',
                        data:{
                          'token':res.entity.token
                        },
                        async:false,
                        dataType: 'json',
                        success: function (data) {
                          console.log(data);
                          if(data.code!==10000){
                            layer.msg('登录成功',{icon:6,time:600},function(){
                              window.location.href="../../index.html"
                            });
                          }else{
                            layer.msg(res.message);
                          }
                        },
                        error:function(data){
                          layer.msg(data.message);
                        },
                      });
                    }else{
                      layer.msg(res.message);
                    }
                },
                error:function(res){
                    layer.msg(res.message);
                },
            });
            return false;
        });
    });
</script>
</body>
</html>